$(document).ready(function() {
    var isHigherThanIE8 = !document.all || !!document.addEventListener;

    // particles
    isHigherThanIE8 &&
        particlesJS("particles", {
            "particles": {
                "number": {
                    "value": 40,
                    "density": {
                        "enable": true,
                        "value_area": 1500
                    }
                },
                "color": {
                    "value": "#ffffff"
                },
                "shape": {
                    "type": "circle",
                    "polygon": {
                        "nb_sides": 2
                    }
                },
                "opacity": {
                    "value": 1,
                    "random": false,
                    "anim": {
                        "enable": false,
                        "speed": 1,
                        "opacity_min": 0.3,
                        "sync": false
                    }
                },
                "size": {
                    "value": 5,
                    "random": true,
                    "anim": {
                        "enable": false,
                        "speed": 30,
                        "size_min": 1,
                        "sync": false
                    }
                },
                "line_linked": {
                    "enable": true,
                    "distance": 300,
                    "color": "#ffffff",
                    "opacity": .9,
                    "width": 1.5
                },
                "move": {
                    "enable": true,
                    "speed": 2,
                    "direction": "none",
                    "random": false,
                    "straight": false,
                    "out_mode": "out",
                    "bounce": false,
                    "attract": {
                        "enable": false,
                        "rotateX": 300,
                        "rotateY": 1200
                    }
                }
            },
            "retina_detect": true
        });

    // progressbar
    var bar01 = null,
        bar02 = null,
        bar03 = null;
    // if (isHigherThanIE8) {
    //     bar01 = new ProgressBar.Circle('#section-02-progress-01', {
    //         trailColor: '#ddd',
    //         strokeWidth: 2,
    //         trailWidth: 1,
    //         easing: 'easeInOut',
    //         duration: 2000,
    //         text: {
    //             autoStyleContainer: false
    //         },
    //         from: {
    //             color: '#7fc8fe',
    //             width: 1
    //         },
    //         to: {
    //             color: '#0084eb',
    //             width: 2
    //         },
    //         step: function(state, circle) {
    //             circle.path.setAttribute('stroke', state.color);
    //             circle.path.setAttribute('stroke-width', state.width);
    //             var value = Math.round(circle.value() * 133 / 2);
    //             if (value === 0) {
    //                 circle.setText('');
    //             } else {
    //                 circle.setText(value + '+');
    //             }
    //         }
    //     });
    //     bar01.text.style.fontSize = '54px';
    //     bar01.text.style.color = '#218ce9';

    //     bar02 = new ProgressBar.Circle('#section-02-progress-02', {
    //         trailColor: '#ddd',
    //         strokeWidth: 2,
    //         trailWidth: 1,
    //         easing: 'easeInOut',
    //         duration: 2000,
    //         text: {
    //             autoStyleContainer: false
    //         },
    //         from: {
    //             color: '#fcaf3e',
    //             width: 1
    //         },
    //         to: {
    //             color: '#fcaf3e',
    //             width: 2
    //         },
    //         step: function(state, circle) {
    //             circle.path.setAttribute('stroke', state.color);
    //             circle.path.setAttribute('stroke-width', state.width);
    //             var value = Math.round((circle.value() * 2000).toFixed(1));
    //             if (value === '0.0') {
    //                 circle.setText('');
    //             } else {
    //                 circle.setText(value + '+');
    //             }
    //         }
    //     });
    //     bar02.text.style.fontSize = '54px';
    //     bar02.text.style.color = '#fcaf3e';

    //     bar03 = new ProgressBar.Circle('#section-02-progress-03', {
    //         trailColor: '#ddd',
    //         strokeWidth: 2,
    //         trailWidth: 1,
    //         easing: 'easeInOut',
    //         duration: 2000,
    //         text: {
    //             autoStyleContainer: false
    //         },
    //         from: {
    //             color: '#ea8163',
    //             width: 1
    //         },
    //         to: {
    //             color: '#ea8163',
    //             width: 3
    //         },
    //         step: function(state, circle) {
    //             circle.path.setAttribute('stroke', state.color);
    //             circle.path.setAttribute('stroke-width', state.width);
    //             var value = Math.round(circle.value() * 100);
    //             if (value === 0) {
    //                 circle.setText('');
    //             } else {
    //                 circle.setText(value + '%');
    //             }
    //         }
    //     });
    //     bar03.text.style.fontSize = '54px';
    //     bar03.text.style.color = '#ea8163';
    // }


    // animations
    $.fn.extend({
        animateCss: function(animationName) {
            var animationEnd = 'webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend';
            this.addClass('animated ' + animationName).one(animationEnd, function() {
                $(this).removeClass('animated ' + animationName);
            });
        }
    });
    // section 02
    // if (isHigherThanIE8) {
    //     $('.section-02 ul').waypoint(function() {
    //         bar01.animate(0.75);
    //         bar02.animate(0.5);
    //         bar03.animate(0.3);
    //         this.destroy();
    //     }, {
    //         offset: '80%'
    //     });
    // } else {
    //     //TODO: append number text to section-02
    //     //TODO: fix css transform on section-05
    // }
    // // section 03
    // $('.section-03 .section-text-container').waypoint(function() {
    //     $('.section-03 .invisible').removeClass('invisible');
    //     $('.section-03 .section-background').animateCss('fadeIn');
    //     // $('.section-03 a').animateCss('fadeIn');
    //     // $('.section-03 h3, .section-03 li').animateCss('fadeInLeftShort');
    //     this.destroy();
    // }, {
    //     offset: '60%'
    // });
    // // section 04
    // $('.section-04 .section-text-container').waypoint(function() {
    //     $('.section-04 .invisible').removeClass('invisible');
    //     $('.section-04 .section-background').animateCss('fadeIn');
    //     $('.section-04 .background-item-01').animateCss('bounceIn');
    //     // $('.section-04 a').animateCss('fadeIn');
    //     // $('.section-04 h3, .section-04 li').animateCss('fadeInRightShort');
    //     this.destroy();
    // }, {
    //     offset: '60%'
    // });
    // // section 05
    // $('.section-05 .section-text-container').waypoint(function() {
    //     $('.section-05 .invisible').removeClass('invisible');
    //     $('.section-05 .section-background, .section-05 .background-item-03').animateCss('fadeIn');
    //     $('.section-05 .background-item-01').animateCss('rotateInQuarter');
    //     $('.section-05 .background-item-02').animateCss('zoomInUp');
    //     $('.section-05 .background-item-03').animateCss('zoomInUp');
    //     // $('.section-05 a').animateCss('fadeIn');
    //     // $('.section-05 h3, .section-05 li').animateCss('fadeInLeftShort');
    //     this.destroy();
    // }, {
    //     offset: '60%'
    // });
    // // section 06
    // $('.section-06 .section-text-container').waypoint(function() {
    //     $('.section-06 .invisible').removeClass('invisible');
    //     $('.section-06 .section-background').animateCss('fadeIn');
    //     $(
    //         '.section-06 .background-item-01, ' +
    //         '.section-06 .background-item-03, ' +
    //         '.section-06 .background-item-05, ' +
    //         '.section-06 .background-item-07, ' +
    //         '.section-06 .background-item-02, ' +
    //         '.section-06 .background-item-04, ' +
    //         '.section-06 .background-item-06, ' +
    //         '.section-06 .background-item-08'
    //     ).animateCss('fadeIn');
    //     // $(
    //     //   '.section-06 .background-item-02, ' +
    //     //   '.section-06 .background-item-04, ' +
    //     //   '.section-06 .background-item-06, ' +
    //     //   '.section-06 .background-item-08'
    //     // ).animateCss('bounceIn');
    //     // $('.section-06 a').animateCss('fadeIn');
    //     // $('.section-06 h3, .section-06 li').animateCss('fadeInRightShort');
    //     this.destroy();
    // }, {
    //     offset: '60%'
    // });
});